<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/taglibs.jsp"%>
<%@ include file="/commons/commonEdit.jsp"%>
<%@ include file="/commons/validation.jsp"%>
<%@ include file="/commons/dateTime.jsp" %>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>新增 装修申请</title>
<script type="text/javascript" src="${ctx }/scripts/public3.js"></script>
<script type="text/javascript" src="${ctx}/scripts/public.js"></script>
<script type="text/javascript" src="${ctx}/scripts/common/prototype.js"></script>
<script type="text/javascript" src="${ctx}/scripts/common.js"></script>
<script language="JavaScript"  src="${ctx}/scripts/div/common.js"></script>
<script type="text/javascript" src="${ctx}/scripts/ajaxException.js"></script>

<script type="text/javascript">
	var sourceValue="";//存放表单原始值

	function openHouseSelect(){ //打开选房间的页面
		var ownerUrl = "${ctx}/customer_chooseSingleHouseAction.do?method=chooseBuildingMain";
		ownerUrl += "&parentFrameId=requisitionAddIfm";
		top.windowOpen(ownerUrl , "chooseBuildFrm", "选择房间",500,800);
	}
	function setHouseInfo(houseId,houseNum){	//设置房号
		document.getElementById("houseId").value = houseId;
		document.getElementById("houseNumber").value = houseNum;
		$('houseNumber').fireEvent("onblur");
	}

	function setClientNamesAndArea(response){//验房成功，获取业主姓名及面积
	  var url = "${ctx}/renovation_renovateRequisitionAction.do?method=getHouseInfo";
	  var houseNumber = $('houseNumber').value;
		new Ajax.Request(url,
			         { method:'post',
					   parameters:{houseNumber:houseNumber},
					   onSuccess:back
					 }
			);
	}
	function back(response){ //回调设置业主姓名及面积
   		var json = response.responseText;
   		json = eval("("+json+")");
   		$('tdClientNames').innerHTML=json.clientNames;//显示业主姓名
   		$('clientNames').value=json.clientNames;
   		$('area').value=json.area;
   	}

	function clearClientNamesAndArea(response){//验房失败，清楚业主姓名及面积
		var json = response.responseText;
		validationAlert("houseNumber",false,json);
		$('tdClientNames').innerHTML=""//显示业主姓名
   		$('clientNames').value="";
   		$('area').value="";
	}


	function renovateTypeAlter(typeName){ //装修类型改变时必填样式改变

		if (typeName == "ourself_radio"){ //自装
			$('companyName_td').className="aux_intable_td2";
			$('level_td').className="aux_intable_td2";

			Validation.removeElmValidate('companyName');
			Validation.removeElmValidate('level');
			$('companyName').className="inputtext max-length-36";

		}else{ //装修公司

			$('companyName_td').className="aux_intable_require";
			$('level_td').className="aux_intable_require";
			$('companyName').className="inputtext required max-length-36";
			$('level').className="select-one-required";
		}
	}

	function setDays(){	//计算装修天数
		beginDate =  $('beginDate').value;
		endDate=$('endDate').value;

		endList = endDate.split("-")
		endDate = new Date(endList[1] + '-' + endList[2] + '-' + endList[0]) //转换为12-18-2002格式

		beginList = beginDate.split("-")
		beginDate = new Date(beginList[1] + '-' + beginList[2] + '-' + beginList[0])

		if (beginDate > endDate){
			$('renovateDays').innerText="";
			return ;
		}

		var iDays = parseInt(Math.abs(endDate - beginDate) / 1000 / 60 / 60 /24) //把相差的毫秒数转换为天数

		if (isNaN(iDays)){
			$('renovateDays').innerText="";
		}else{
			$('renovateDays').innerText=iDays+1;
		}
	}

	function addForm(){//增加
		var isTrue=$("requisitionAddForm").fireEvent("onSubmit");
  		if(isTrue){
  			setButtonStatus(false);
			var params = $("requisitionAddForm").serialize();
			var url = "${ctx}/renovation_renovateRequisitionAction.do?method=addRequisition";
			sendAjaxRequest(url,params,function(response){

				setButtonStatus(true);
				ajaxSubmitException(response.responseText);
				findFrame('main').cur_p = 1;
				findFrame('main').refleshRenReqNotConFrame(); //刷新主页面列表
				windowClose();
			});
		}
	}

	function submitAddForm(){//先新增（提交）
		var isTrue=$("requisitionAddForm").fireEvent("onSubmit");
  		if(isTrue){
  		setButtonStatus(false);
			var params = $("requisitionAddForm").serialize();
			var url = "${ctx}/renovation_renovateRequisitionAction.do?method=addRequisition";
			sendAjaxRequest(url,params,backSubmitWin);
		}
	}
	function backSubmitWin(response){//再提交
		setButtonStatus(true);
		ajaxSubmitException(response.responseText);
		findFrame('main').cur_p = 1;
		findFrame("main").refleshRenReqFrame(); //刷新主页面列表

		var requisitionId = response.responseText;
		findFrame("proceduresRenovationFrm").editSubmit("addToSubmit",requisitionId); //提交
		windowClose();
	}

	function setButtonStatus(status){ //设置按钮状态 true 代表可用 false代表不可用
		$("btn1_12").disabled = !status;
		$("btn1_22").disabled = !status;
		$("btn1_32").disabled = !status;
	}


</script>
</head>

<body >
<form   name="requisitionAddForm" id="requisitionAddForm" method="post" action=""  class="required-validate">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td class="window_head_outBg">

	    <table border="0" cellpadding="0" cellspacing="0">
	      <tr>
	        <td><img src="${ctx}/images/ico_Advance.gif" width="16" height="16" align="absmiddle" /> <span class="window_head_intext">新建装修申请</span></td>
	      </tr>
	    </table>

    </td>
  </tr>
  <tr><td class="aux_header_line_1"></td></tr>
  <tr><td class="aux_header_line_2">
  	  </td>
  </tr>
  <tr>
    <td class="content">

    <table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td class="aux_outtable_color">

        <table width="100%" border="0" cellpadding="0" cellspacing="1" class="aux_intable_color">
          <tr>
            <td colspan="4" class="aux_titletable">业主资料</td>
          </tr>
          <tr>
            <td class="aux_intable_td1">房 号：</td>
            <td class="aux_intable_require"><table border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td><input type="hidden" id="houseId" name="houseId">
	                <input name="houseNumber" id="houseNumber" type="text"
	                	   class="required validate-char validate-ajax" size="16"
	                	   onSuccess="setClientNamesAndArea"
	                	   onFailure="clearClientNamesAndArea"
                           validateUrl="${ctx}/renovation_renovateRequisitionAction.do?method=checkHouseNumber"
                           afterInsert="houseNumberSpan" /></td>
                <td width="4">&nbsp;</td>
                <td><a href="#" onClick="openHouseSelect();" onFocus="this.blur()"><img src="${ctx}/images/ico_houesno.GIF" alt="请点选查找房号" border="0" /></a><span id="houseNumberSpan"></span></td>
              </tr>
            </table></td>
            <td class="aux_intable_td1">装修联系人：</td>
            <td class="aux_intable_require"><input name="linkman" id="linkman" type="text" class="inputtext required validate-char max-length-36" size="16" /></td>
          </tr>
          <tr>
            <td class="aux_intable_td1">业主姓名：</td>
            <td class="aux_intable_td2"><span id="tdClientNames"></span><input id="clientNames" name="clientNames" type="hidden"></td>
            <td class="aux_intable_td1">装修联系人电话：</td>
            <td class="aux_intable_require"><input name="linkManPhone" id="linkManPhone" type="text" class="inputtext required validate-char max-length-30" value="" size="16" /></td>
          </tr>
          <tr>
            <td class="aux_intable_td1">装修面积：</td>
            <td class="aux_intable_require"><input name="area" id="area" type="text" class="inputtext required integer-decimal-range-10-2" value="" style="text-align:right" size="16" />&nbsp;㎡</td>
            <td class="aux_intable_td1">&nbsp;</td>
            <td class="aux_intable_td2">&nbsp;</td>
          </tr>
          <tr>
            <td colspan="4" class="aux_titletable">
            	<input name="renovateType" id="ourself_radio"  type="radio" value="001"  onClick="renovateTypeAlter('ourself_radio');" />自 装&nbsp;&nbsp;
                <input name="renovateType" id="corporation_radio" type="radio" value="002"  onClick="renovateTypeAlter('corporation_radio');"  checked="checked" />装修公司承接装修</td>
          </tr>
          <tr>
            <td valign="top" class="aux_intable_td1">装修承建商：</td>
            <td class="aux_intable_require" id="companyName_td"><input name="companyName" id="companyName" type="text"  class="inputtext required validate-char max-length-36" size="16" /></td>
           <td class="aux_intable_td1">装修申请日期：</td>
            <td class="aux_intable_require">
	            <table border="0" cellspacing="0" cellpadding="0">
	                <tr>
	                  <td ><input name="requisitionDate" id="requisitionDate"  type="text" class="required validate-date" value="" size="16" afterInsert="requisitionDateSpan" /></td>
	                  <td width="4">&nbsp;</td>
	                  <td ><img id="imgRequisitionDate" src="${ctx}/images/ico_clock_month.gif" width="20" height="20" border="0" /><span id="requisitionDateSpan"></span></td>
	                </tr>
	            </table>
            </td>

            </tr>
          <tr>
            <td class="aux_intable_td1">资质等级：</td>
            <td class="aux_intable_require" id="level_td">
	            <pms:unitedSelect
               		id="level"
               		name="level"
               		optionLabel="name"
               		optionValue="value"
               		selectText="请选择..."
               		dataList="${levels}"
               		className="select-one-required"
               		style="width:110px;">
	         </pms:unitedSelect>
            </td>
            <td class="aux_intable_td1">防火负责人：</td>
            <td class="aux_intable_require"><input name="fireproofingMan" id="fireproofingMan" type="text" class="inputtext required validate-char max-length-36" size="16" /></td>
          </tr>
          <tr>
            <td class="aux_intable_td1">现场负责人：</td>
            <td class="aux_intable_require" ><input name="burdenMan" id="burdenMan" type="text" class="inputtext required validate-char max-length-36" size="16" /></td>
            <td class="aux_intable_td1">身份证号码：</td>
            <td class="aux_intable_require"><input name="identityCard" id="identityCard" type="text" class="inputtext required validate-char max-length-36" size="16" /></td>
          </tr>

          <tr>
            <td class="aux_intable_td1">现场负责人电话：</td>
            <td class="aux_intable_require"><input name="burdenManPhone" id="burdenManPhone" type="text" class="inputtext required validate-char max-length-30" size="16" /></td>
            <td class="aux_intable_td1">装修施工期限：</td>
            <td class="aux_intable_require">

	            <table border="0" cellspacing="0" cellpadding="0">
	                <tr>
	                  <td>&nbsp;从&nbsp;</td>
	                  <td><input name="beginDate" id="beginDate" type="text" class="required validate-date great-equals-than-requisitionDate"
	                  			 validateMessageGreatEquals="应大于等于装修申请日期" value="" size="8"  onchange="setDays();" afterInsert="beginDateSpan"  /></td>
	                  <td width="4">&nbsp;</td>
	                  <td width="4"><img id="imgBeginDate" src="${ctx}/images/ico_clock_month.gif" width="20" height="20" /><div id="beginDateSpan"></div></td>
	                  <td >&nbsp;至&nbsp;</td>
	                  <td><input name="endDate" id="endDate" type="text" class="required validate-date great-equals-than-beginDate" value="" onchange="setDays();" size="8" afterInsert="endDateSpan" /></td>
	                  <td width="4">&nbsp;</td>
	                  <td><img id="imgEndDate" src="${ctx}/images/ico_clock_month.gif" width="20" height="20" /><span id="endDateSpan"></span></td>
	                  <td>共</td>
	                  <td><input type="hidden" class="inputtext" value="" style="text-align:right" size="1" />&nbsp;<span id="renovateDays" ></span>&nbsp;</td>
	                  <td>天</td>
	                </tr>
	            </table>

             </td>
          </tr>
          <tr>
            <td valign="top" class="aux_intable_td1">装修项目：</td>
            <td class="aux_intable_require_more"><textarea name="items" id="items" cols="28" rows="5" class="required max-length-200" ></textarea></td>
            <td valign="top" class="aux_intable_td1">备 注：</td>
            <td class="aux_intable_td2"><textarea name="remark" id="remark" cols="28" rows="5" class="max-length-200" ></textarea></td>
          </tr>
        </table></td>
      </tr>
    </table>

    </td>
  </tr>
  <tr>
    <td class="window_footer"><table border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td><table border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td class="buttonOffLeft" id="btn1_11"></td>
            <td class="buttonOffMiddle" id="btn1_12" onClick="submitAddForm();" onMouseOver="btn_change_over(1)" onMouseOut="btn_change_out(1)" onBlur="btn_change(1)"><img src="${ctx}/images/ico_submit.gif" alt="" width="14" height="14" border="0" align="absbottom" /> 提 交</td>
            <td class="buttonOffRight" id="btn1_13"></td>
          </tr>
        </table></td>
        <td>&nbsp;</td>

        <td><table border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td class="buttonOffLeft" id="btn1_21"></td>
              <td class="buttonOffMiddle" id="btn1_22" onClick="addForm();" onMouseOver="btn_change_over(2)" onMouseOut="btn_change_out(2)" onBlur="btn_change(2)"><img src="${ctx}/images/ico_ok.gif" alt="" width="14" height="14" border="0" align="absbottom" /> 保 存</td>
              <td class="buttonOffRight" id="btn1_23"></td>
            </tr>
        </table></td>
        <td class="btn_between_space"></td>
        <td><table border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td class="buttonOffLeft" id="btn1_31"></td>
              <td class="buttonOffMiddle" id="btn1_32" onClick="windowClose();" onMouseOver="btn_change_over(3)" onMouseOut="btn_change_out(3)" onBlur="btn_change(3)"><img src="${ctx}/images/ico_cancel.gif" alt="" width="14" height="14" border="0" align="absbottom" /> 关 闭</td>
              <td class="buttonOffRight" id="btn1_33"></td>
            </tr>
        </table></td>
      </tr>
    </table></td>
  </tr>
</table>
</form>

<script type="text/javascript">
             Calendar.setup(
              {
	              inputField : "requisitionDate", // ID of the input field
	              ifFormat : "%Y-%m-%d", // the date format
	              button : "imgRequisitionDate", // ID of the button
	             // align          :    "Tl",           // alignment (defaults to "Bl")
			      singleClick    :    true
              }
              );

              Calendar.setup(
              {
	              inputField : "beginDate", // ID of the input field
	              ifFormat : "%Y-%m-%d", // the date format
	              button : "imgBeginDate", // ID of the button
	             // align          :    "Tl",           // alignment (defaults to "Bl")
			      singleClick    :    true
              }
              );

              Calendar.setup(
              {
	              inputField : "endDate", // ID of the input field
	              ifFormat : "%Y-%m-%d", // the date format
	              button : "imgEndDate", // ID of the button
	             // align          :    "Tl",           // alignment (defaults to "Bl")
			      singleClick    :    true
              }
              );

</script>

</body>
</html>